<script setup lang="ts">
// let props = defineProps(['toSon'])
import {computed, ref, watch} from "vue";
//
// let props = defineProps<{
//   toSon: string,
//   id: number,
//   title: string
// }>()
// console.log(props, 'props')
// console.log(props.toSon, 'props')
// console.log(props.id)
// // props.id++
// // let ids = computed(() => {
// //   return props.id
// // })
// // ids++
// let ids = ref();
// watch(() => props.id, () => {
//   // console.log(props.id)
//   ids.value = props.id
// }, {deep: true, immediate: true})
// console.log(ids.value)
//
// function changeIds() {
//   ids.value++
//   console.log(ids.value)
// }
// let model = defineModel()
// console.log(model.value)
// function update() {
//   model.value++
//   console.log(model.value)
// }
// let Flag = defineModel()
//
// function cancel() {
//   Flag.value = false
// }
// let emit = defineEmits(['change']);
// // emit('change', 103)
// emit('change', {id:103})
interface idsType {
  id: number
}

let emit = defineEmits<{
  // (e: 'change', id: number): void
  (e: 'change', ids: idsType): void
}>()
// emit('change', 103)
// emit('change', {id: 103})
function toFather(){
  emit('change', {id: 103})
}
</script>

<template>
  子组件
  <!--  {{ ids }}-->
  <!--  <button @click="changeIds">changeIds</button>-->
  <!--  <div>Parent bound v-model is: {{ model }}</div>-->
  <!--  <button @click="update">Increment</button>-->
  <!--  <div v-if="Flag">弹框</div>-->
  <!--  <button @click="cancel">取消</button>-->
  <button @click="toFather">toFather</button>
</template>

<style scoped>

</style>
